<template xmlns:el-col="http://www.w3.org/1999/html">
  <!--商机详情-->
  <div class="details">
    <div class="detailsTop" >
      <img src="../imgs/details.png"/>
      <div class="businessName">{{this.business.businessName}}</div>
      <div class="businessButton">
        <span v-if="keEdit !=1">
           <el-button type="primary" size="small" icon="el-icon-edit" @click="updateBusiness()" v-if="business.speedInfoBySpeedId.speedId !=5">编辑</el-button>
        </span>

        <el-button size="small" icon="el-icon-back" @click="back">返回</el-button>
      </div>
      <P></P>
      <table style="width:96%;text-align: center;margin-top:16px;">
        <tr style="font-size:12px;color:#777;">
          <td>客户名称</td>
          <td>商机金额</td>
          <td>商机负责人</td>
          <td>商机阶段</td>
          <td>可能性</td>
          <td>创建时间</td>
        </tr>
        <tr style="font-size: 14px;">
          <td>{{this.business.customerByCustomId.cusName}}</td>
          <td>{{this.business.expectedAmount | formatMoney }}</td>
          <td>{{this.business.budinessEmpid.empName}}</td>
          <td>{{this.business.speedInfoBySpeedId.speedContext}}</td>
          <td>{{this.business.speedInfoBySpeedId.possibility}}</td>
          <td>{{this.business.businessTime |formatDate}}</td>
        </tr>
      </table>
      <p></p>
    </div>
    <div class="step">
      <el-steps :active="business.speedInfoBySpeedId.speedId"  align-center>
        <el-step  v-for=" speed in speedList" :title="speed.speedContext" :key="speed.speedId"></el-step>
      </el-steps>
    </div>
    <el-tabs type="border-card">
      <el-tab-pane label="跟进记录">
        <div v-if="keEdit !=1">
          <el-form :model="followUpObject" v-if="business.speedInfoBySpeedId.speedId !=5">
            <el-form-item style=" width: 94%; margin-left: 29px;">
              <el-input type="textarea" :rows="row" placeholder="请输入内容" v-model="followUpObject.followContext" @focus="context1" >
              </el-input>
            </el-form-item>
            <transition name="el-fade-in">
              <div class="quickAdd" v-show="isAdd">
                <el-row>
                  <el-col :span="11">
                    <el-form-item label="跟进类型:" style="margin-left: 26px;">
                      <el-select v-model="followUpObject.followTypeByFollId"  style="width: 184px;margin-left: 28px;" placeholder="请选择" size="small"
                                 value-key="follId" @change="changeQuick">
                        <el-option v-for=" type in typeList" :key="type.follId" :label="type.follType" :value="type"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="11">
                    <el-row>
                      <el-col :span="22">
                        <el-form-item label="快捷添加:" style="margin-left: 10px;">
                          <el-select v-model="followUpObject.quickByQuickId" placeholder="请选择" size="small" value-key="quickId" @change="changeOne">
                            <el-option v-for="quick in quickList" style="width:211px;" :key="quick.quickId" :label="quick.quickContext" :value="quick"></el-option>
                          </el-select>
                          <i class="el-icon-setting" id="setting" @click="lookMoban"></i>
                        </el-form-item>
                      </el-col>
                      <el-col :span="2">
                        <el-button  icon="el-icon-close" plain style="border:0;border: 0px;margin-left: 55px;" @click="closeFollow"></el-button>
                      </el-col>
                    </el-row>
                  </el-col>
                  <el-col class="jin" :span="11">
                    <el-form-item label="下次联系时间:" style="margin-left: 26px;">
                      <el-date-picker
                        v-model="followUpObject.fnextContactTime"  :picker-options="pickerOptions1" size="small"  type="date" placeholder="选择日期"
                        format="yyyy-MM-dd" style="width:185px">
                      </el-date-picker>
                    </el-form-item>
                  </el-col>
                  <el-col :span="11" >
                    <el-checkbox v-model="checked" style="margin-left: 12px;">保存为快捷跟进模板</el-checkbox>
                  </el-col>
                  <el-col  class="jin">
                    <el-form-item style="float:right;margin-right: 38px;">
                      <el-button type="primary" size="small" @click="addQuick">添加</el-button>
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
            </transition>
          </el-form>
        </div>
        <!--时间线-->
        <div class="block">
          <el-timeline>
            <el-timeline-item  :timestamp="activity.followTime | formatDate" placement="top"  v-for="(activity,index) in activities"
                               :key="index">
              <el-card>
                <h4> <img :src="activity.followEmp.empImgpath"
                          style="border-radius:50%;width:45px;height:45px;" />
                  <span class="followOne">
                     {{activity.followEmp.empName}}
                  添加了一条快捷信息
                  {{activity.followType}}
                  </span>
                </h4>
                <p class="followTwo">{{activity.followContext}}</p>
                <p class="followThree">下次联系时间:{{activity.fnextContactTime}}</p>

              </el-card>
            </el-timeline-item>
          </el-timeline>
        </div>
      </el-tab-pane>
      <el-tab-pane label="详细需求">
        <div style="width:100%;overflow: hidden" v-if="keEdit !=1">
          <el-button  type="primary" size="small" style="float: right;" @click="addDemand" v-if="business.speedInfoBySpeedId.speedId !=5 ">添加需求</el-button>
        </div>
        <el-table  :header-cell-style="{background:'#eef1f6',color:'#606266'}" :data="DemandList" style="width: 100%;margin-top: 10px;">
          <el-table-column type="expand">
            <template slot-scope="demand">
              <el-form label-position="left" inline class="demo-table-expand">
                <el-form-item label="需求主题:">
                  <span>{{demand.row.demandTitle}}</span>
                </el-form-item>
                <el-form-item label="客户名称:">
                  <span>{{demand.row.customerByCustomId.cusName}}</span>
                </el-form-item>
                <el-form-item label="对应商机:">
                  <span>{{demand.row.businessInfoByBusinesId.businessName}}</span>
                </el-form-item>
                <el-form-item label="需求提供人:">
                  <span>{{demand.row.demandPeople}}</span>
                </el-form-item>
                <el-form-item label="重要程度:">
                  <span>{{demand.row.demandImport}}</span>
                </el-form-item>
                <el-form-item label="需求内容:">
                  <span>{{demand.row.demandContext}}</span>
                </el-form-item>
                <el-form-item label="记录人:">
                  <span>{{demand.row.demandEmp.empName}}</span>
                </el-form-item>
                <el-form-item label="记录时间:">
                  <span>{{demand.row.demandTime|formatDate}}</span>
                </el-form-item>

              </el-form>
            </template>
          </el-table-column>
          <el-table-column  prop="demandTitle" label="需求主题">
          </el-table-column>
          <el-table-column  prop="customerByCustomId.cusName" label="客户名称"  width="180">
          </el-table-column>
          <el-table-column  prop="demandImport"  label="重要程度">
          </el-table-column>
          <el-table-column prop="demandPeople"  label="需求提供人">
          </el-table-column>
          <el-table-column label="记录时间">
            <template slot-scope="demandTime">
              {{demandTime.row.demandTime | formatDate}}
            </template>
          </el-table-column>
          <el-table-column label="操作" v-if="business.speedInfoBySpeedId.speedId !=5">
            <template slot-scope="operation">
              <el-button type="text" icon="el-icon-edit" @click="updateDemand(operation.row)" v-if="keEdit !=1"></el-button>
             <!-- <el-button type="text" icon="el-icon-delete" @click="deleteDemand(operation.row.demandId)"></el-button>-->
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="竞争关系">
        <div style="width:100%;overflow: hidden" v-if="keEdit !=1">
          <el-button type="primary" size="small" style="float: right;" @click="clickCompetitor"  v-if="business.speedInfoBySpeedId.speedId !=5 ">添加竞争关系</el-button>
        </div>
        <el-table :header-cell-style="{background:'#eef1f6',color:'#606266'}"
                  :data="competitorList" style="width: 100%;margin-top: 10px;">
          <el-table-column type="expand">
            <template slot-scope="props">
              <el-form label-position="left" inline class="demo-table-expand">
                <el-form-item label="竞争产品:">
                  <span>{{ props.row.competitorProduct.comProductsName }}</span>
                </el-form-item>
                <el-form-item label="客户名称:">
                  <span>{{ props.row.customerByCustomId.cusName}}</span>
                </el-form-item>

                <el-form-item label="产品报价:">
                  <span>{{ props.row.competitorPrice }}</span>
                </el-form-item>
                <el-form-item label="竞争能力:">
                  <span>{{ props.row.competitorAbility }}</span>
                </el-form-item>
                <el-form-item label="优势:">
                  <span>{{ props.row.advantage }}</span>
                </el-form-item>
                <el-form-item label="劣势:">
                  <span>{{ props.row.inferiority }}</span>
                </el-form-item>
                <el-form-item label="应对策略:">
                  <span>{{ props.row.strategy }}</span>
                </el-form-item>
                <el-form-item label="记录人:">
                  <span>{{props.row.competitorEmp.empName}}</span>
                </el-form-item>
                <el-form-item label="记录时间:">
                  <span>{{props.row.competitorTime|formatDate}}</span>
                </el-form-item>
              </el-form>
            </template>
          </el-table-column>
          <el-table-column prop="competitorProduct.comProductsName" :show-overflow-tooltip='true' label="竞争产品" >
          </el-table-column>
          <el-table-column  :show-overflow-tooltip='true' prop="customerByCustomId.cusName" label="客户名称">
          </el-table-column>
          <el-table-column  :show-overflow-tooltip='true' prop="competitorPrice" label="对手报价" >
          </el-table-column>
          <el-table-column  label="记录时间" >
            <template slot-scope="com">
              {{com.row.competitorTime |formatDate}}
            </template>
          </el-table-column>
          <el-table-column label="操作"  v-if="business.speedInfoBySpeedId.speedId !=5">
            <template slot-scope="scope1">
              <el-button type="text" size="small" icon="el-icon-edit" @click="editCompetitions(scope1.row)" v-if="keEdit !=1"></el-button>
             <!-- <el-button type="text" size="small" icon="el-icon-delete" @click="deleteCompetitor(scope1.row)"></el-button>-->
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="解决方案">
        <div style="width:100%;overflow: hidden"  v-if=" keEdit !=1">
          <span v-if="business.speedInfoBySpeedId.speedId !=5">
             <el-button v-if="business.speedInfoBySpeedId.speedId >=2" type="primary" size="small" style="float: right;" @click="clickProgramme" >添加方案</el-button>
          </span>
        </div>
        <el-table :header-cell-style="{background:'#eef1f6',color:'#606266'}"
                  :data="programmeList" style="width: 100%;margin-top: 10px;">
          <el-table-column type="expand">
            <template slot-scope="props1">
              <el-form label-position="left" inline class="demo-table-expand">
                <el-form-item label="方案主题:">
                  <span>{{ props1.row.programmeTitle }}</span>
                </el-form-item>
                <el-form-item label="商机名称:">
                  <span>{{ props1.row.businessInfoByBusinesId.businessName }}</span>
                </el-form-item>
                <el-form-item label="客户名称:">
                  <span>{{ props1.row.customerByCustomId.cusName }}</span>
                </el-form-item>
                <el-form-item label="方案内容:">
                  <span>{{ props1.row.programmeContent}}</span>
                </el-form-item>
                <el-form-item label="客户反馈:">
                  <span>{{ props1.row.customerFeedback }}</span>
                </el-form-item>
                <el-form-item label="制定人:">
                  <span>{{ props1.row.programmeEmp.empName }}</span>
                </el-form-item>
              </el-form>
            </template>
          </el-table-column>
          <el-table-column  prop="programmeTitle"   label="方案主题"  >
          </el-table-column>
          <el-table-column  prop="customerByCustomId.cusName"  label="客户名称">
          </el-table-column>
          <el-table-column label="制定时间">
            <template slot-scope="pro">
              {{pro.row.programmeTime|formatDate}}
            </template>
          </el-table-column>
          <el-table-column label="操作" v-if="business.speedInfoBySpeedId.speedId !=5">
            <template slot-scope="e1">
              <el-button type="text" size="small" icon="el-icon-edit" @click="updateprogramme(e1.row)" v-if=" keEdit !=1"></el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="联系人">
        <div style="float: right;overflow: hidden" v-if="keEdit !=1">
          <el-button type="primary" size="small"  @click="isContact=true"  v-if="business.speedInfoBySpeedId.speedId !=5">关联联系人</el-button>
        </div>
        <el-table :header-cell-style="{background:'#eef1f6',color:'#606266'}" :data="contactsList"
                  style="width: 100%;padding-top: 10px;">
          <el-table-column prop="culinkmanByCupId.cupName" label="姓名">
          </el-table-column>
          <el-table-column  prop="culinkmanByCupId.cupPhone" label="手机号码">
          </el-table-column>
          <el-table-column prop="culinkmanByCupId.cupEmail" label="邮箱">
          </el-table-column>
          <el-table-column prop="culinkmanByCupId.cupPost" label="职务">
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="产品详情">
        <div style="width:100%;overflow: hidden" v-if="keEdit !=1">
          <el-button v-if="business.speedInfoBySpeedId.speedId !=5" type="primary" size="small" style="float: right;" @click="openEditProducts">编辑产品</el-button>
        </div>
        <el-table :data="detailsList" :header-cell-style="{background:'#eef1f6',color:'#606266'}"
                  style="width: 100%;margin-top: 10px;">
          <el-table-column  prop="zproductByProductId.productName"  label="产品名称" >
          </el-table-column>
          <el-table-column  prop="zproductByProductId.prModel"   label="型号"  width="120" align="center">
          </el-table-column>
          <el-table-column   label="售价" align="center">
            <template slot-scope="ll">
              {{ll.row.detPrice | formatMoney}}
            </template>
          </el-table-column>
          <el-table-column label="折扣%" prop="detDiscount">
          </el-table-column>
          <el-table-column label="折后价">
            <template slot-scope="ll1">
              {{ll1.row.detDiscountedPrice | formatMoney}}
            </template>
          </el-table-column>
          <el-table-column  label="数量" width="160" align="center" prop="detNum">
          </el-table-column>
          <el-table-column label="单位"  prop="psUnit" align="center">
          </el-table-column>
          <el-table-column label="小计"  align="center">
            <template slot-scope="ll2">
              {{ll2.row.detTotal | formatMoney}}
            </template>
          </el-table-column>
        </el-table>
        <div style="float:right;margin-top:10px;">
          <p style="font-size:18px;">
            总金额:<span style="color:red;">￥{{ProductTotal | formatMoney}}</span>
          </p>
        </div>
      </el-tab-pane>
      <el-tab-pane label="报价记录">
        <div style="width:100%;overflow: hidden"  v-if="business.speedInfoBySpeedId.speedId !=5">
          <span v-if="keEdit !=1">
             <el-button  v-if="business.speedInfoBySpeedId.speedId >=3"type="primary" size="small" style="float: right;" @click="offerButton"  >添加报价</el-button>
          </span>
        </div>
        <el-table
          :header-cell-style="{background:'#eef1f6',color:'#606266'}"
          :data="offerList"
          style="width: 100%;margin-top: 10px;">
          <el-table-column prop="businessInfoByBusinesId.businessName"  label="对应商机">
          </el-table-column>
          <el-table-column prop="customerByCustomId.cusName"  label="客户名称">
          </el-table-column>
          <el-table-column  label="报价单号">
            <template scope="ss">
              <span style="color:blue;cursor: pointer" @click="lookDetails(ss.row)">{{ss.row.offerNumber}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="productOffer" label="报价">
          </el-table-column>
          <el-table-column label="申请时间">
            <template slot-scope="app">
              {{app.row.offerTime|formatDate}}
            </template>
          </el-table-column>
          <el-table-column  label="状态" prop="offerStatus"  >
            <template slot-scope="scope2">
              <span v-if="scope2.row.offerStatus==1"> 提交</span>
              <span v-if="scope2.row.offerStatus==2"> 待审批</span>
              <span v-if="scope2.row.offerStatus==3"> 审批中</span>
              <span v-if="scope2.row.offerStatus==4"> 同意</span>
              <span v-if="scope2.row.offerStatus==5"> 否决</span>
            </template>
          </el-table-column>
        </el-table>

      </el-tab-pane>
    </el-tabs>
    <!--管理快捷跟进模板 isMoban-->
    <el-dialog title="管理快捷跟进模板" :visible.sync="isMoban" width="40%">
      <div class="moban">
        <el-scrollbar style="height:100%;">
          <el-row v-for=" quick in allQuickList" :key="quick.quickId">
            <el-col>
              <p class="classOne">
                类型:{{quick.followTypeByFollId.follType}}
                <el-button type="text" icon="el-icon-edit" size="small" @click="showQuick(quick)"></el-button>
                <el-button type="text" icon="el-icon-delete" size="small" @click="deleteQuick(quick)"></el-button>
              </p>
            </el-col>
            <el-col>
              <p class="classOne">
                {{quick.quickContext}}
              </p>
            </el-col>
          </el-row>
          <el-button type="text" icon="el-icon-plus" style="margin-left: 10px;" @click="addShowQuick">添加</el-button>
        </el-scrollbar>
      </div>
      <!--编辑快捷模版-->
      <el-dialog title="快捷模板" :visible.sync="isSaveQuick" width="40%" append-to-body>
        <el-form  :model="quickObject" style="margin-left:12px;">
          <el-form-item label="跟进类型:" >
            <el-select  v-model="quickObject.followTypeByFollId" placeholder="请选择" size="small" value-key="follId">
              <el-option v-for=" type in typeList" :key="type.follId" :label="type.follType" :value="type"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="快捷内容:">
            <el-input type="textarea"  v-model="quickObject.quickContext" :rows="3"  placeholder="请输入内容" style="width:384px;">
            </el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="saveQuick">确 定</el-button>
          <el-button @click="isSaveQuick = false">取 消</el-button>
        </div>
      </el-dialog>
      <div slot="footer" class="dialog-footer">
        <el-button @click="isMoban = false">返回</el-button>
      </div>
    </el-dialog>
    <!--详细需求-->
    <el-dialog title="详细需求" :visible.sync="showDemand" width="54%">
      <el-form label-width="90px" :model="demandObject" :rules="demandRules" ref="demandObject">
        <el-row>
          <el-col>
            <el-form-item label="需求主题" prop="demandTitle">
              <el-input v-model="demandObject.demandTitle"></el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="客户名称:">
              <el-input readonly v-model="demandObject.customerByCustomId.cusName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="对应商机:">
              <el-input readonly v-model="demandObject.businessInfoByBusinesId.businessName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="重要程度:">
              <el-select style="width: 253px;" v-model="demandObject.demandImport">
                <el-option value="非常重要"></el-option>
                <el-option value="重要"></el-option>
                <el-option value="一般重要"></el-option>
                <el-option value="不重要"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="需求提供人:">
              <el-input v-model="demandObject.demandPeople"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所有者:">
              <el-input readonly v-model="demandObject.demandEmp.empName"></el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="需求内容:">
              <el-input type="textarea" rows="3" v-model="demandObject.demandContext"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showDemand = false">取 消</el-button>
        <el-button type="primary" @click="savedemand">确 定</el-button>
      </span>
    </el-dialog>
    <!--添加竞争对手 isCompetitor -->
    <el-dialog title="竞争关系" :visible.sync="isCompetitor" width="54%">
      <el-form :model="competitorObject" :rules="competitorRules" ref="competitorForm" label-width="100px" class="demo-ruleForm">
        <el-row>
          <el-col>
            <el-form-item label="客户名称:" >
              <el-input
                :readonly="true" v-model="competitorObject.customerByCustomId.cusName">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="对应商机:" >
              <el-input
                :readonly="true" v-model="competitorObject.businessInfoByBusinesId.businessName" >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="记录人:" >
              <el-input
                :readonly="true" v-model="competitorObject.competitorEmp.empName">
              </el-input>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="竞争产品:" prop="competitorProduct.comProductsName">
              <el-input v-model="competitorObject.competitorProduct.comProductsName" readonly>
                <el-button slot="append" icon="el-icon-search" @click="comProducts=true"></el-button>
              </el-input >
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="产品报价:" prop="competitorPrice">
              <el-input v-model="competitorObject.competitorPrice" oninput="value=value.replace(/[^\d.]/g,'')"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="竞争能力:">
          <el-radio-group v-model="competitorObject.competitorAbility">
            <el-radio label="核心竞争"></el-radio>
            <el-radio label="有力竞争"></el-radio>
            <el-radio label="一般竞争"></el-radio>
            <el-radio label="忽略竞争"></el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="优势:" >
          <el-input type="textarea" v-model="competitorObject.advantage"></el-input>
        </el-form-item>
        <el-form-item label="劣势:" >
          <el-input type="textarea" v-model="competitorObject.inferiority"></el-input>
        </el-form-item>
        <el-form-item label="应对策略:"  >
          <el-input type="textarea" v-model="competitorObject.strategy"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveCompetiter">确 定</el-button>
        <el-button @click="isCompetitor = false">取 消</el-button>
      </div>
      <el-dialog
        title="竞品"
        width="55%"
        :visible.sync="comProducts"
        append-to-body>
        <el-row>
          <el-col :span="20">搜索:
            <el-input size="small" v-model="comProductsName"  @change="searchComProducts" style="width: 200px;" placeholder="请输入竞品名称" suffix-icon="el-icon-search"></el-input>
          </el-col>
          <el-col :span="4">
            <el-button type="primary" size="small" @click="addComproductsButton">添加竞品</el-button>
          </el-col>
          <el-col>
            <el-table height="300" :data="comProList">
              <el-table-column type="selection"></el-table-column>
              <el-table-column label="竞品名称" width="200">
                <template slot-scope="comProd">
                  <span style="cursor:pointer;color:#409EFF" @click ="clickComProduct(comProd.row)"><i class="el-icon-caret-right"></i>{{comProd.row.comProductsName}}</span>
                </template>
              </el-table-column>
              <el-table-column label="价格范围" prop="comPriceRange" width="185">
              </el-table-column>
              <el-table-column label="竞争能力" prop="comPower" width="185">
              </el-table-column>
              <el-table-column label="操作">
                <template slot-scope="caozuo">
                  <el-button icon="el-icon-edit" type="text" @click="updateComPro(caozuo.row)"></el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
          <el-col>
            <!-- <el-button size="small" icon="el-icon-delete" style="margin-top: 10px;"></el-button>-->
            <el-pagination
              @size-change="comhandleSizeChange"
              @current-change="comhandleCurrentChange"
              :current-page.sync="comProPageSize"
              style="float:right;margin-top: 10px;"
              :page-sizes="pageList"
              layout="total, sizes, prev, pager, next, jumper"
              :total="comProTotal">
            </el-pagination>
          </el-col>
          <el-col style="height:20px;"></el-col>
        </el-row>


        <el-dialog
          title="竞品信息"
          :visible.sync="addComProducts"
          append-to-body>
          <el-form label-width="90px"  :model="comProdutsObject" ref="comProductsForm"  :rules="comProductsRules">
            <el-row>
              <el-col>
                <el-form-item label="竞品名称:" prop="comProductsName">
                  <el-input size="small" v-model="comProdutsObject.comProductsName" style="width:530px;"></el-input>
                </el-form-item>
              </el-col>
              <el-col>
                <el-form-item label="优势:">
                  <el-input size="small" v-model="comProdutsObject.comAdvantage" type="textarea" rows="3" style="width: 530px;"></el-input>
                </el-form-item>
              </el-col>
              <el-col>
                <el-form-item label="劣势:">
                  <el-input size="small" type="textarea" v-model="comProdutsObject.comInferiority"  rows="3" style="width: 530px;"></el-input>
                </el-form-item>
              </el-col>
              <el-col>
                <el-form-item label="应对策略:">
                  <el-input type="textarea" v-model="comProdutsObject.comStrategy" style="width: 530px;"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="价格范围:">
                  <el-input size="small" v-model="comProdutsObject.comPriceRange" style="width: 209px;"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="竞争能力:">
                  <el-select size="small" style="width: 209px;" v-model="comProdutsObject.comPower">
                    <el-option value="核心竞争"></el-option>
                    <el-option value="有力竞争"></el-option>
                    <el-option value="一般竞争"></el-option>
                    <el-option value="忽略竞争"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="addComProducts = false">取 消</el-button>
            <el-button type="primary" @click="addComProductsMethos">确定</el-button>
          </div>
        </el-dialog>
      </el-dialog>
    </el-dialog>
    <!--新增方案 isProgramme-->
    <el-dialog title="解决方案" :visible.sync="isProgramme">
      <el-form :model="programmeObject" :rules="programmeRules" ref="programmeRules" label-width="100px">
        <el-row>
          <el-form-item label="方案主题" prop="programmeTitle" >
            <el-input v-model="programmeObject.programmeTitle"></el-input>
          </el-form-item>
          <el-col>
            <el-form-item label="客户名称:" >
              <el-input v-model="programmeObject.customerByCustomId.cusName" :readonly="true">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="对应商机:" >
              <el-input v-model="programmeObject.businessInfoByBusinesId.businessName"
                        :readonly="true">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="制定人:" >
              <el-input v-model="programmeObject.programmeEmp.empName"
                        :readonly="true">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="方案内容:"  >
              <el-input type="textarea" v-model="programmeObject.programmeContent" :rows="4" ></el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="客户反馈:">
              <el-input type="textarea" v-model="programmeObject.customerFeedback" :rows="3"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveProgramme">确 定</el-button>
        <el-button @click="isProgramme = false">取 消</el-button>
      </div>
    </el-dialog>
    <!--编辑产品 isEditGood-->
    <el-dialog title="编辑产品" :visible.sync="isEditGood"  >
      <el-row>
        <el-col :span="6" class="editFont">
          批量操作:  <el-button size="small" @click="deleteGood">删除</el-button>
        </el-col>
        <el-col :span="10" class="editFont">
          <span style="position: relative;top: 9px;">共选择{{count}}个产品</span>
        </el-col>
        <el-col :span="4" class="editFont">
          <el-button type="text" @click="lookHistoryProducts">查看历史产品</el-button>
        </el-col>
        <el-col :span="3" class="editFont">
        <el-button type="text" @click="isAddGood=true">添加产品</el-button>
      </el-col>
        <el-col>
          <div class="editTable">
            <el-table :data="productList"  height="250" ref="selection1"  @selection-change="handleChange1" style="width: 98%"  >
              <el-table-column type="selection" width="55"></el-table-column>
              <el-table-column fixed  prop="zproductByProductId.productName"  label="产品名称"  width="110" >
              </el-table-column>
              <el-table-column  prop="zproductByProductId.prModel"   label="型号"  width="120" align="center">
              </el-table-column>
              <el-table-column    label="价格">
                <template slot-scope="ll3">
                  {{ll3.row.detPrice | formatMoney}}
                </template>
              </el-table-column>
              <el-table-column label="折扣%">
                <template slot-scope="z">
                  <el-input size="mini"  v-model="z.row.detDiscount"  @change="checkMoney(z.$index,z.row)" style="width: 60px"></el-input>
                </template>
              </el-table-column>
              <el-table-column label="折后价">
                <template slot-scope="ll4">
                  {{ll4.row.detDiscountedPrice | formatMoney}}
                </template>
              </el-table-column>
              <el-table-column  label="数量" width="150">
                <template slot-scope="num">
                  <el-input-number v-model="num.row.detNum"  :min="1" :max="10" size="mini" @change="smallPrice(num.$index,num.row)"></el-input-number>
                </template>
              </el-table-column>
              <el-table-column label="单位"   prop="psUnit">
              </el-table-column>
              <el-table-column label="小计">
                <template slot-scope="ll5">
                  {{ll5.row.detTotal | formatMoney}}
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-col>
        <el-col>
          <p style="float: right;font-size: 15px;margin-top: 10px;">总金额:￥<span style="color:red">{{proTotal | formatMoney}}</span></p>
        </el-col>
      </el-row>
      <!--查看历史产品 historyProducts-->
      <el-dialog  title="历史产品" :visible.sync="historyProducts" width="55%" append-to-body>
        <el-row>
          <el-col>
            搜索:
            <el-input suffix-icon="el-icon-search"  placeholder="产品名称" v-model="searchHistoryProducts"
                      @change="changeSearchProducts" size="small" style="width: 30%;"></el-input>
          </el-col>
          <el-col>
            <el-table :data="historyProductsList.slice((currentPage-1)*pagesize,currentPage*pagesize)"  style="width: 100%"   max-height="250">
              <el-table-column  label="日期" prop="date" width="150">
              </el-table-column>
              <el-table-column label="产品名称" prop="prName" fixed width="180">
              </el-table-column>
              <el-table-column prop="prModel"  width="120"   fixed
                label="型号">
              </el-table-column>
              <el-table-column   width="150" label="售价">
                <template slot-scope="yy1">
                  {{yy1.row.price| formatMoney}}
                </template>
              </el-table-column>
              <el-table-column prop="discount"  width="80"
                label="折扣">
              </el-table-column>
              <el-table-column   width="150"
                label="折后价">
                <template slot-scope="yy2">
                  {{yy2.row.discountedPrice| formatMoney}}
                </template>
              </el-table-column>
              <el-table-column label="采用">
                <template slot-scope="history">
                  <el-button type="primary" icon="el-icon-check" circle   @click="historyDiscount(history.row)"></el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
          <el-col>
            <el-pagination
              style="float:right;margin-top:7px;"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[10, 20, 30, 40]"
              :page-size="pagesize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="historyProductsList.length">
            </el-pagination>
          </el-col>

        </el-row>
      </el-dialog>
      <!--添加产品-->
      <el-dialog title="产品列表" :visible.sync="isAddGood" append-to-body width="60%">
        <el-row>
          <el-col>
            产品筛选: <el-cascader  style="margin-left: 20px;" v-model="category" ref="myCascader" :options="data2" :props="{value:'pcId',children:'children', label: 'pcName',expandTrigger: 'hover' }"
                                @change="handleChange" clearable></el-cascader>
            <el-input placeholder="请输入产品名称"  @change="searchProduct" suffix-icon="el-icon-search" v-model="searchPro"  style="width: 200px;margin-left:20px">
            </el-input>
          </el-col>
        </el-row>
        <el-row style="margin-top: 13px">
         <!-- <el-col :span="3">
            已选产品:
          </el-col>
          <el-col :span="19" style="height:37px; margin-top: -7px;">
            <el-scrollbar style="height: 100%" >
              <el-tag v-for=" mi in multipleSelection"  type="in" :key="mi.prsId">
                {{mi.zproductByProductId.productName}}  {{mi.zproductByProductId.prModel}}
              </el-tag>
            </el-scrollbar>
          </el-col>-->
        </el-row>
        <el-row>
          <el-col>
            <el-table   :data="goodList"
                        ref="multipleSelection"
                       style="width: 100%"  height="320">
              <el-table-column type="expand">
                <template slot-scope="props">
                  <el-form label-position="left" inline class="demo-table-expand1">
                    <el-form-item  v-for="(pro,index) in props.row.zsidesmodelmiddlesByPsId":key="index" :label="pro.zspecificationsvalueBySpecId.zspecificationsByOnsId.onsName+':'">
                      <span>{{pro.zspecificationsvalueBySpecId.specVlaue}}</span>
                    </el-form-item>
                  </el-form>
                </template>
              </el-table-column>
              <el-table-column type="selection" width="55" >
              </el-table-column>
              <el-table-column  width="180" prop="zproductByProductId.productName" label="产品名称" >
              </el-table-column>
              <el-table-column width="180" prop="zproductByProductId.prModel" label="型号">
              </el-table-column>
              <el-table-column width="120"  label="图片">
                <template slot-scope="img">
                  <el-image
                    style="width:50px;height:50px;"
                    class="table-td-thumb"
                    :src="img.row.zproductByProductId.prImgpath"
                    :preview-src-list="[img.row.zproductByProductId.prImgpath]"
                  ></el-image>
                </template>
              </el-table-column>
              <el-table-column label="进价" prop="psFactoryPrice"></el-table-column>
              <el-table-column   label="售价">
                <template slot-scope="ll6">
                  {{ll6.row.psPrice | formatMoney}}
                </template>
              </el-table-column>
            </el-table>
          </el-col>
          <el-col>
            <el-pagination style="float:right;margin-top: 5px;" :current-page.sync="currentPage2" :page-sizes="[20, 40, 60, 100]"
                           :page-size="pageSize2" layout="total, sizes, prev, pager, next, jumper"
                           :total="goodList.length" @current-change="changeProSize"
                           @size-change="handleSizeChange2">
            </el-pagination>
          </el-col>
          <el-col style="height:9px;"></el-col>
        </el-row>
        <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="determineProducts">确 定</el-button>
        <el-button @click="isAddGood = false">取 消</el-button>
      </span>
      </el-dialog>
      <span slot="footer" class="dialog-footer">
         <el-button type="primary" @click="saveDetails">确 定</el-button>
        <el-button @click="isEditGood = false">取 消</el-button>
    </span>
    </el-dialog>

    <!--关联联系人 isContact-->
    <el-dialog title="客户联系人" :visible.sync="isContact">
      <el-row>
        <el-col>
          联系人筛选: <el-input  clearable placeholder="请输入联系人名称" @change="searchCulinkMan" v-model="relation" suffix-icon="el-icon-search" style="width:200px;">
        </el-input>
        </el-col>
        <el-col>
          <el-table :data="culinkManList" height="250" style="width: 100%">
            <el-table-column width="55">
              <template slot-scope="culink">
                <el-radio v-model="radio" :label="culink.row.cupId" @change="retainId(culink.row.cupId)">
                  {{''}}
                </el-radio>
              </template>
            </el-table-column>
            <el-table-column prop="cupName" label="姓名" >
            </el-table-column>
            <el-table-column  prop="cupPhone" label="联系电话" >
            </el-table-column>
            <el-table-column  prop="cupEmail" :show-overflow-tooltip='true' label="邮箱">
            </el-table-column>
            <el-table-column prop="cupPost" label="职位">
            </el-table-column>
          </el-table>
        </el-col>

      </el-row>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="contactOk()">确 定</el-button>
        <el-button @click="isContact = false">取 消</el-button>
      </div>
    </el-dialog>
    <!--新增报价 isUpdate-->
    <el-dialog title="报价单" :visible.sync="isUpdate" width="55%">
      <el-form  :model="offerObject"  ref="offerFrom" :rules="offerRules"  label-width="100px" class="demo-ruleForm">
        <el-row>
          <el-col >
            <el-form-item label="报价主题:"   prop="offerTitle">
              <el-input v-model="offerObject.offerTitle"></el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="客户名称:">
              <el-input :readonly="true" v-model="offerObject.customerByCustomId.cusName">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报价单号:"  >
              <el-input :readonly="true" v-model="offerObject.offerNumber"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="对应商机:" >
              <el-input
                :readonly="true" v-model="offerObject.businessInfoByBusinesId.businessName" >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="产品报价:" >
              <el-input :readonly="true"  v-model="offerObject.productOffer" ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="预估毛利:">
              <el-input :readonly="true" v-model="offerObject.profit"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报价人:">
              <el-input  :readonly="true" v-model="offerObject.offerEmp.empName" ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="审批人:" prop="approvaler">
              <el-select  v-model="offerObject.approvaler" style="width: 250px;">
                <el-option-group
                  v-for="group in approvalList"
                  :key="group.postName"
                  :label="group.postName">
                  <el-option
                    v-for="item in group.empVos"
                    :key="item.employeesId"
                    :label="item.empName"
                    :value="item.employeesId">
                  </el-option>
                </el-option-group>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col >
            <el-form-item label="付款说明:" >
              <el-input type="textarea"  v-model="offerObject.PaymentInstructions"  size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col >
            <el-form-item label="运输说明:" >
              <el-input type="textarea"  v-model="offerObject.transportInstructions" size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col >
            <el-form-item label="报价备注:" >
              <el-input type="textarea" v-model="offerObject.offerRemarks" size="small"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="isUpdate = false">取 消</el-button>
        <el-button type="primary" @click="saveOffer">确 定</el-button>
      </div>
    </el-dialog>

    <!-- 报价单详细信息-->
    <el-dialog
      title="报价明细"
      :visible.sync="isOfferDetails" width="60%"  class="print">
      <el-button type="text" icon=" el-icon-printer" style="margin-left: 650px;margin-top: -12px;" @click="printOffer" >打印单据</el-button>
      <el-form  :mode="offerOne"  label-width="100px"
                class="bjDetails">
        <el-row>
          <el-col>
            <el-form-item label="报价主题:"  >
              <el-input  readonly v-model="offerOne.offerTitle" style="width: 640px;"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报价单号:"  >
              <el-input  readonly v-model="offerOne.offerNumber" style="width: 254px;"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="客户名称:">
              <el-input readonly  v-model="offerOne.customerByCustomId.cusName">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="对应商机:" >
              <el-input readonly
                        style="width: 254px;" v-model="offerOne.businessInfoByBusinesId.businessName">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="报价人:">
              <el-input  readonly v-model="offerOne.offerEmp.empName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="产品报价:" >
              <el-input readonly  v-model="offerOne.productOffer" style="width: 254px;"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="预估毛利:">
              <el-input  readonly v-model="offerOne.profit"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item  label="审核状态:">
              <el-input  readonly value="提交" v-if="offerOne.offerStatus==1"></el-input>
              <el-input  readonly value="待审批" v-if="offerOne.offerStatus==2"></el-input>
              <el-input  readonly value="审批中" v-if="offerOne.offerStatus==3"></el-input>
              <el-input  readonly value="同意" v-if="offerOne.offerStatus==4"></el-input>
              <el-input  readonly value="否决" v-if="offerOne.offerStatus==5"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item  label="接收人:">
              <el-input  readonly  v-model="offerOne.businessInfoByBusinesId.culinkmanByCupId.cupName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="付款说明:" >
              <el-input  readonly  v-model="offerOne.paymentInstructions" style="width: 640px;"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="运输说明:" >
              <el-input  readonly   v-model="offerOne.transportInstructionsstyle"  style="width: 640px;"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="报价备注:" >
              <el-input   readonly  v-model="offerOne.offerRemarks" style="width:640px;"></el-input>
            </el-form-item>
          </el-col>

          <el-col>
            <el-form-item  label="审核记录:">
              <el-row class="timeline">
                <el-timeline>
                  <el-timeline-item
                    v-for="(activity, index) in activities1" :key="index" >
                    {{activity.apprsDate | formatDate}} {{activity.empByEmployeesId.empName}} {{activity.cucheckTypeByCutId.cutName}}
                  </el-timeline-item>
                </el-timeline>
              </el-row>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-row style="margin-left: 20px;">
        <el-col>
          产品信息:
        </el-col>
        <el-col>
          <el-table :data="offerTwo" :header-cell-style="{background:'#eef1f6',color:'#606266'}"
                    style="width: 97%;margin-top: 10px;">
            <el-table-column  prop="productside.zproductByProductId.productName"  label="产品名称" >
            </el-table-column>
            <el-table-column  prop="productside.zproductByProductId.prModel"   label="型号"  >
            </el-table-column>
            <el-table-column  label="价格">
              <template slot-scope="lll1">
                {{lll1.row.prsPrice| formatMoney}}
              </template>
            </el-table-column>
            <el-table-column label="折扣%" prop="prsDiscount">
            </el-table-column>
            <el-table-column label="折后价" >
              <template slot-scope="lll2">
                {{lll2.row.prsDiscountedPrice| formatMoney}}
              </template>
            </el-table-column>
            <el-table-column  label="数量" prop="prsNum" >
            </el-table-column>
            <el-table-column label="单位"   prop="productside.psUnit">
            </el-table-column>
            <el-table-column label="小计"  prop="prsCount">
              <template slot-scope="lll3">
                {{lll3.row.prsCount| formatMoney}}
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <div style="height:40px;"></div>
    </el-dialog>

  </div>

</template>

<script>
  import {formatTimeToStr} from "../assets/format";

  export default {
    data() {
      var checkedComProducts = (rule, value, callback) => {
        console.log("来了")
        if(this.updateComProductsName == value){
          callback();
        }else{
          this.$axios.get("http://localhost:8088/buDetails/is_not_comProductsName",
            {params:{comProductName:value}}).then(v=>{
            console.log("查询"+v.data);
            if(v.data == 1){
              callback(new Error('竞品名称已存在，请重新输入!'));
            }else{
              callback();
            }
          }).catch();
        }

      };
      return {
        pickerOptions1: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 8.64e7;
          }
        },
        isOfferDetails: false,
        cupId1: 0,
        business: {
          businesId: '',//商机id
          businessName: '',//商机名称
          budinessEmpid: {//员工对象
            employeesId: 0,//员工id
            empName: ''//员工名称
          },//商机负责人
          customerByCustomId: {//客户对象
            customId: '',//客户id
            cusName: ''//客户名称
          },//客户名称
          speedInfoBySpeedId: {//进度对象
            speedId: 0,//进度id
            speedContext: '',//进度内容
            possibility: '',//可能性
          },//商机进度
          expectedAmount: 0,
        },//商机顶部信息

        speedList: [],//所有进度
        //时间线
        reverse: false,
        activities: [],//时间线数据
        isMoban: false,//管理快捷添加模板
        isSaveQuick: false,//编辑快捷模板
        //快捷添加的信息
        row: 2,//设置文本域的大小
        isAdd: false,//隐藏快捷添加
        followUpObject: {//跟进记录对象
          businessInfoByBusinesId: {//商机对象
            businesId: 0
          },
          followTypeByFollId: {//跟进类型对象
            follId: 0,
            follType: ''
          },
          quickByQuickId: {//快捷信息对象
            quickId: 0,
            quickContext: ''
          },
          followContext: '',//跟进内容
          fnextContactTime: '',//下次联系时间
          followType: '',//跟进类型
          followEmp: {
            employeesId: '',
          },
        },
        typeList: [],//存所有的跟进类型
        quickList: [],//存所有的快捷信息
        checked: false,//是否保存为快捷模板
        allQuickList: [],//存储所有的快捷信息
        quickObject: {//快捷信息对象
          quickId: 0,
          followTypeByFollId: {
            follId: 0,
            follType: ''
          },
          quickContext: ''//快捷内容
        },
        //详细需求
        showDemand: false,//需求表单控制
        demandObject: {
          demandId: '',
          demandTitle: '',
          demandPeople: '',
          demandImport: '',
          demandContext: '',
          customerByCustomId: {
            customId: '',
            cusName: '',
          },
          businessInfoByBusinesId: {
            businesId: '',
            businessName: '',
          },
          demandEmp: {
            employeesId: '',
            empName: '',
          }
        },
        demandRules: {
          demandTitle: [
            {required: true, message: '请输入需求主题', trigger: 'blur'}
          ]
        },
        //需求集合
        DemandList: [],

        comProducts: false,//竞品弹框
        addComProducts: false,//编辑竞品弹框
        comProdutsObject: {//竞品对象
          comProductsId: '',
          comProductsName: '',
          comAdvantage: '',
          comInferiority: '',
          comStrategy: '',
          comPriceRange: '',
          comPower: ''
        },
        competitors: false,
        competitorList1: [],//竞争公司数组
        updateComProductsName: '',//修改竞品名称
        comProductsName: '',//竞品名称
        comProPageSize: 1,
        comProPageNum: '',
        comProTotal: '',
        comProList: [],
        pageList: [4, 6, 8],
        comProductsRules: {
          comProductsName: [
            {required: true, message: '请输入竞争名称', trigger: 'blur'},
            {validator: checkedComProducts, trigger: 'blur'}
          ]
        },
        isCompetitor: false,//添加竞争对手
        competitorObject: {
          competitorId: '',//竞争id
          competitionCompany: '',//竞争公司
          businessInfoByBusinesId: {//商机对象
            businesId: 0,//商机id
            businessName: ''//商机名称
          },//对应商机
          customerByCustomId: {//客户对象
            customId: 0,//客户id
            cusName: '',//客户名称
          },
          competitorProduct: {//竞争产品
            comProductsId: '',
            comProductsName: '',
          },
          competitorPrice: '',//对手报价
          competitorAbility: '',//竞争能力
          advantage: '',//优势
          inferiority: '',//劣势
          strategy: '',//应对策略
          competitorEmp: {//记录人
            employeesId: '',
            empName: ''
          }
        },
        competitorRules: {//竞争对手表单验证
          competitionCompany: [
            {required: true, message: '请输入竞争公司', trigger: ['blur', 'change']}
          ],
          'competitorProduct.comProductsName': [
            {required: true, message: '竞争产品不能为空', trigger: 'change'}
          ],
          competitorPrice: [
            {required: true, message: '产品报价不能为空', trigger: 'blur'}
          ]
        },
        competitorList: [],//竞争对手集合
        isProgramme: false,//添加方案
        programmeObject: {//方案对象
          programmeId: 0,//方案id
          programmeTitle: '',//方案主题
          businessInfoByBusinesId: {//商机对象
            businesId: 0,//商机id
            businessName: ''//商机名称
          },
          customerByCustomId: {//客户对象
            customId: 0,//客户id
            cusName: '',//客户名称
          },
          programmeEmp: {//方案制定人
            employeesId: '',
            empName: ''
          },
          programmeContent: '',//方案内容
          customerFeedback: ''//客户反馈
        },
        programmeRules: {
          programmeTitle: [{required: true, message: '请输入方案主题', trigger: 'blur'}],
        },
        programmeList: [],//方案集合

        contactsList: [],//联系人数组
        culinkManList: [],//客户联系人集合
        //关联联系人
        relation: '',//联系人搜索
        radio: '',//单选框
        isContact: false,

        isEditGood: false,//编辑产品
        in: 'info',//标签类型
        searchPro: '',//添加商品里面的查询
        data2: [],//产品分类数组
        category: '',//类型查询
        productSizes: [20, 40, 60, 100],//产品分页可选择的页数
        currentPage2: 1,//当前页
        pageSize2: 0,//页大小
        totalSize2: 0,//总页数
        goodList: [],//产品列表
        detailsList: [],//确定产品列表
        multipleSelection: [],//存取勾选中的产品
        currentPage4: 4,//分页
        category: '',
        pcId: 0,//类型id
        pbId: 0,//品牌id
        historyProducts: false, //客户历史产品
        historyProductsList: [],//客户历史产品集合
        searchHistoryProducts: '',//搜索历史产品名称
        isAddGood: false,//添加产品
        detailsList: [],//产品详情列表
        goodList: [],//添加产品列表
        productList: [],//编辑产品列表
        pList: [],


        isUpdate: false,//新增报价
        offerObject: {//报价对象
          offerId2: 0,//报价id
          offerTitle: '',//报价主题
          offerNumber: '',//报价单号
          productOffer: 0,//产品报价
          profit: '',//预估毛利
          paymentInstructions: '',//付款说明
          transportInstructions: '',//运输说明
          offerRemarks: '',//备注
          offerEmp: {//员工对象
            employeesId: 0,
            empName: ''
          },
          approvaler: '',//审批人
          customerByCustomId: {//客户对象
            customId: 0,
            cusName: '',
          },
          businessInfoByBusinesId: {//商机对象
            businesId: 0,
            businessName: ''
          }
        },
        //offer表单验证
        offerRules: {
          offerTitle: [{required: true, message: '请输入报价主题', trigger: 'blur'}],
          approvaler: [{required: true, message: '请选择审批人', trigger: 'change'}],
        },

        offerList: [],
        productOffer: '',
        profit: '',
        offerOne: {
          offer_id2: 0,
          offerTitle: '',
          offerNumber: '',
          productOffer: '',
          paymentInstructions: '',
          transportInstructions: '',
          offerStatus: '',
          offerRemarks: '',
          profit: '',
          offerEmp: {
            empName: ''
          },
          customerByCustomId: {
            cusName: ''
          },
          businessInfoByBusinesId: {
            businessName: '',
            culinkmanByCupId: {
              cupName: ''
            }
          }
        },
        offerTwo: [],
        approvalList: [],//审批人
        flag: true,//控制折扣
        activities1: [],//审批记录
        currentPage: 1,
        pagesize: 10,
        keEdit:'',
      }
    },
    created :function() {
     /* this.openFullScreen();*/
      this.keEdit = this.$route.query.status;
      this.queryBusiness(this.$route.query.businesId);//商机顶部信息
      this.businessSpeed();//加载商机进度
      this.followType1();//加载跟进类型
      this.queryFollowUp(this.$route.query.businesId);//加载跟进记录
      this.queryDemand(this.$route.query.businesId);//加载详细需求
      this.selectCompetitor(this.$route.query.businesId);//加载所有竞争对手
      this.selectProgramme(this.$route.query.businesId);//加载所有解决方案
      this.selectClinkman(this.$route.query.businesId);//加载商机下客户联系人
      this.selectDetails(this.$route.query.businesId);//加载商机下的产品详情
      this.initCategory();//加载产品类型
      this.queryOffer(this.$route.query.businesId);//加载商机下的报价单
      this.selectApproval();//审批人
      this.comProPageNum = this.pageList[0];
      this.initComPro(this.comProPageSize, this.comProPageNum,this.comProductsName,this.comPower);//竞品
    },
    methods: {
      openFullScreen() {
        const loading = this.$loading({
          lock: true,
          text: 'Loading',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
        setTimeout(() => {
          loading.close();
        }, 2000);
      },

      //选择审批人
      selectApproval(){
        this.$axios.get("http://localhost:8088/buDetailsTwo/approval").then(v=>{
          this.approvalList = v.data;
        }).catch();
      },
      back(){
        this.$router.go(-1);//返回上一层
      },
      //编辑商机
      updateBusiness(){
        this.$router.push({
          path:'/addbusiness',
          query:{
            businesId:this.business.businesId
          }
        })
      },
      //查询商机的信息
      queryBusiness(businessId){
        this.$axios.get("http://localhost:8088/buInfo/queryBusiness",
          {params:{businesId:businessId}})
          .then(v=>{
            //赋值给表单
            this.business=v.data;
            this.selectCustomerCulinkman(this.relative);
          }).catch()

      },
      //商机步骤条
      businessSpeed(){
        this.$axios.get("http://localhost:8088/buDetailsTwo/speed").then(v=>{
          this.speedList=v.data;
        }).catch()
      },
      //查询该商机下的跟进记录
      queryFollowUp(businesId){
        this.$axios.get("http://localhost:8088/buDetails/select_followUp"
          ,{params:{businesId:businesId}}).then(v=>{
          this.activities=v.data;
        }).catch();
      },
      //跟进记录的操作方法
      context1(){
        this.followUpObject.businessInfoByBusinesId.businesId=this.business.businesId;
        this.followUpObject.followEmp=JSON.parse(sessionStorage.getItem('user'));
        this.isAdd=true;
        this.row=4;
      },
      //关闭跟进记录
      closeFollow(){
        this.isAdd=false;
        this.row=2;
      },
      //跟进类型
      followType1(){
        this.$axios.get("http://localhost:8088/buDetails/follow_type").then(v=>{
          this.typeList=v.data;
        }).catch();
      },
      //根据类型id查询出对应的快捷信息
      changeQuick(){
        this.followUpObject.followType = this.followUpObject.followTypeByFollId.follType;
        this.followUpObject.quickByQuickId=null;
        this.quickList=[];
        this.$axios.get("http://localhost:8088/buDetails/follow_quick",
          {params:{follId:this.followUpObject.followTypeByFollId.follId}}).then(v=>{
          this.quickList=v.data;
        }).catch();
      },
      //把快捷信息赋值给跟进内容
      changeOne(val){
        this.followUpObject.followContext=val.quickContext;
      },
      //添加快捷信息的方法
      addQuick(){
        var id=this.followUpObject.businessInfoByBusinesId.businesId;
        var follow=JSON.stringify({follow:this.followUpObject})
        this.$axios.post("http://localhost:8088/buDetails/follow_up",
          this.qs.stringify({followUp:follow}) ).then(v=>{
          //关闭下拉框这一栏
          this.isAdd=false;
          //清空
          this.clearFollowUp();
          if (v.data==1){
            //刷新一下商机信息
            this.queryBusiness(id);
          }
          this.$message({
            message: '添加成功',
            type: 'success'
          });
          //更新跟进记录
          this.queryFollowUp(id);

        }).catch();
        //当checked不为false时，则确定将
        if(this.checked != false){
          this.$axios.post("http://localhost:8088/buDetails/quick",{
            followTypeByFollId:this.followUpObject.followTypeByFollId,
            quickContext:this.followUpObject.followContext
          }).then(v=>{
            console.log("添加模板！"+v.date);
            if(v.date ==1){
              this.$message({
                message: '快捷模板已存在，不可保存',
                type: 'warning'
              });
            }
          }).catch();
        }
      },
      //查看模板列表
      lookMoban(){
        this.allQuicks();//加载所有的快捷信息
        this.isMoban=true;
      },
      //清空跟进记录
      clearFollowUp(){
        this.followUpObject={//跟进记录对象
          businessInfoByBusinesId:{//商机对象
            businesId:0
          },
          followTypeByFollId: {//跟进类型对象
            follId:0,
            follType:''
          },
          quickByQuickId:{//快捷信息对象
            quickId:0,
            quickContext:''
          },
          followContext:'',//跟进内容
          fnextContactTime:'',//下次联系时间
          followEmp:{
            employeesId:'',
          },
        }
        this.row=2;
        this.checked = false;
      },
      //所有的快捷信息
      allQuicks(){
        this.$axios.get("http://localhost:8088/buDetails/all_quicks").then(v=>{
          this.allQuickList=v.data;
        }).catch();
      },
      //显示快捷模板弹框
      showQuick(item){
        this.quickObject.quickId=item.quickId;
        this.quickObject.followTypeByFollId=item.followTypeByFollId;
        this.quickObject.quickContext=item.quickContext;
        this.isSaveQuick=true;
      },
      //删除模板
      deleteQuick(val){
        this.$confirm('此操作将永久删除该模板, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$axios.post("http://localhost:8088/buDetails/delete_quicks",
            this.qs.stringify({quickId:val.quickId})).then(()=>{
            this.allQuicks();
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          }).catch();

        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      //添加按钮
      addShowQuick(){
        //先清空表单
        this.clearQuick();
        this.isSaveQuick=true;
      },
      //新增或修改快捷模板
      saveQuick(){
        this.$axios.post("http://localhost:8088/buDetails/quick",{
          quickId:this.quickObject.quickId,
          followTypeByFollId:this.quickObject.followTypeByFollId,
          quickContext:this.quickObject.quickContext
        }).then(v=>{
          this.clearQuick();
          if(v.date==1){
            this.$message({
              message: '快捷模板已存在，不可保存',
              type: 'warning'
            });
          }
          this.isSaveQuick=false;
          this. allQuicks();
        }).catch();
      },
      //清空快捷模板
      clearQuick(){
        this.quickObject={//快捷信息对象
          followTypeByFollId:{
            follId:0,
            follType:''
          },
          quickContext:''//快捷内容
        }
      },

      //添加详细需求按钮
      addDemand(){
        if(this.$refs.demandObject != undefined){
          this.$refs.demandObject.resetFields();
        }
        this.clearDemand();
        this.demandObject.demandEmp = JSON.parse(sessionStorage.getItem("user"));
        this.demandObject.businessInfoByBusinesId.businesId = this.business.businesId;
        this.demandObject.businessInfoByBusinesId.businessName = this.business.businessName;
        this.demandObject.customerByCustomId=this.business.customerByCustomId;
        this.showDemand = true;

      },
      updateDemand(row){
        this.demandObject = row;
        this.showDemand = true;
      },
      deleteDemand(demandId){
        this.$confirm('此操作将永久删除该需求, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$axios.post("http://localhost:8088/buDetails/delete_demand",
            this.qs.stringify({demandId:demandId})).then(()=>{
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
            this.queryDemand(this.business.businesId);
          }).catch();
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });

      },
      openEditProducts(){
        this.isEditGood=true;
        this.productList=[];
        this.detailsList.forEach((item,i)=>{
          this.productList.splice(i,0,JSON.parse(JSON.stringify(item)));
        })
        this.historyProductsData(this.business.customerByCustomId.customId,this.searchHistoryProducts);
      },
      //清空表单
      clearDemand(){
        this.demandObject={
          demandId:'',
          demandTitle:'',
          demandPeople:'',
          demandImport:'',
          demandContext:'',
          customerByCustomId:{
            customId:'',
            cusName:'',
          },
          businessInfoByBusinesId:{
            businesId:'',
            businessName:'',
          },
          demandEmp:{
            employeesId:'',
            empName:'',
          }
        }
      },
      //新增或修改详细需求
      savedemand(){
        this.$refs.demandObject.validate((valid) => {
          if (valid) {
            this.$axios.post("http://localhost:8088/buDetails/save_demand"
              ,this.demandObject).then(()=>{
              this.showDemand = false;//关闭弹框
              this.$refs.demandObject.resetFields();
              this.clearDemand();
              if(this.demandObject.demandId>0){
                this.$message.success("修改成功！");
              }else{
                this.$message.success("添加成功！");
              }
              this.queryDemand(this.business.businesId);
            }).catch();
          } else {
            return false;
          }
        });
      },
      queryDemand(businesId){
        this.$refs
        this.$axios.get("http://localhost:8088/buDetails/query_demand",
          {params:{businesId:businesId}}).then(v=>{
          this.DemandList = v.data;
        }).catch();
      },
      updateComPro(row){
        this.updateComProductsName = row.comProductsName;
        this.comProdutsObject= row;
        this.addComProducts = true;
      },
      //竞品管理
      initComPro(comProPageSize,comProPageNum,comProductsName){
        this.$axios.get("http://localhost:8088/buDetails/select_comProducts",
          {params:{
              comProPageSize:comProPageSize,
              comProPageNum:comProPageNum,
              comProductsName:comProductsName}}
        ).then(v=>{
          this.comProTotal = v.data.comProductsTotal;
          this.comProList = v.data.comProductsList;
        }).catch();
      },
      //竞品查询
      searchComProducts(){
        this.initComPro(1,this.comProPageNum,this.comProductsName);
      },
      comhandleSizeChange(val){
        this.initComPro(this.comProPageSize,val,this.comProductsName);
      },
      comhandleCurrentChange(val){
        this.initComPro(val,this.comProPageNum,this.comProductsName);
      },
      //选择竞品
      clickComProduct(row){
        this.competitorObject.competitorProduct.comProductsId = row.comProductsId;
        this.competitorObject.competitorProduct.comProductsName = row.comProductsName;
        this.competitorObject.advantage = row.comAdvantage;
        this.competitorObject.inferiority = row.comInferiority;
        this.competitorObject.competitorAbility = row.comPower;
        this.competitorObject.strategy=row.comStrategy;
        this.comProducts = false;
      },
      //新增竞品按钮
      addComproductsButton(){
        if(this.$refs.comProductsForm !=undefined){
          this.$refs.comProductsForm.resetFields();
        }
        this.clearComProduncts();
        this.addComProducts = true;
      },
      clearComProduncts(){
        this.comProdutsObject={//竞品对象
          comProductsId:'',
          comProductsName:'',
          comAdvantage:'',
          comInferiority:'',
          comStrategy:'',
          comPriceRange:'',
          comPower:''
        }
      },
      //新增或修改竞品
      addComProductsMethos(){
        this.$refs.comProductsForm.validate((valid) => {
          if (valid) {
            this.$axios.post("http://localhost:8088/buDetails/save_comProducts",
              this.comProdutsObject).then(()=>{
              this.addComProducts = false;
              if(this.comProdutsObject.comProductsId ==''){
                this.$message.success("添加成功！")
              }else{
                this.$message.success("修改成功！")
              }
              this.clearComProduncts();
              this.$refs.comProductsForm.resetFields();
              this.initComPro(this.comProPageSize,this.comProPageNum,this.comProductsName);
            }).catch();
          } else {
            console.log('error submit!!');
            return false;
          }
        });

      },
      //显示竞争对手表单
      clickCompetitor(){
        if(this.$refs.competitorForm !=undefined){
          this.$refs.competitorForm.resetFields()
        }
        this.clearCompetitor();
        this.competitorObject.businessInfoByBusinesId.businesId=this.business.businesId;
        this.competitorObject.businessInfoByBusinesId.businessName=this.business.businessName;
        this.competitorObject.customerByCustomId=this.business.customerByCustomId;
        this.competitorObject.competitorEmp = JSON.parse(sessionStorage.getItem("user"));
        this.isCompetitor=true;
      },
      //所有竞争公司
      selectAllCompetitor(){
        this.$axios.get("http://localhost:8088/buDetails/select_all_competition").then(v=>{
          this.competitorList1 = v.data;
        }).catch();
      },
      //选择竞争公司
      determine(val){
        this.competitorObject.competitionCompany = val;
        this.competitors = false;
      },
      //新增竞争对手
      saveCompetiter(){
        this.$refs.competitorForm.validate((valid) => {
          if (valid) {
            var id=this.competitorObject.businessInfoByBusinesId.businesId;
            var competitor=JSON.stringify({competitor:this.competitorObject});
            this.$axios.post("http://localhost:8088/buDetails/save_competitor",
              this.qs.stringify({competitor:competitor})).then(()=>{
              //清空表单
              this.$refs.competitorForm.resetFields();
              this.clearCompetitor();
              //更新竞争对手
              this.selectCompetitor(id);
              this.isCompetitor=false;
              this.$message({
                type: 'success',
                message: '添加成功!'
              });
            }).catch();
          } else {
            console.log('error submit!!');
            return false;
          }
        });

      },
      //清空竞争对手表单
      clearCompetitor(){
        this.competitorObject={
          competitorId:'',//竞争id
          competitionCompany:'',//竞争公司
          businessInfoByBusinesId:{//商机对象
            businesId:0,//商机id
            businessName:''//商机名称
          },//对应商机
          customerByCustomId:{//客户对象
            customId:0,//客户id
            cusName:'',//客户名称
          },
          competitorEmp:{//记录人
            employeesId:'',
            empName:''
          },
          competitorProduct:{
            comProductsId:'',
            comProductsName:'',
          },//竞争产品
          competitorPrice:'',//对手报价
          competitorAbility:'',//竞争能力
          advantage:'',//优势
          inferiority:'',//劣势
          strategy:''//应对策略
        }
      },
      //修改竞争对手
      editCompetitions(row){
        this.competitorObject = row;
        this.isCompetitor=true;
      },
      //删除竞争对手
      deleteCompetitor(row){
        this.$confirm('此操作将永久删除该竞争对手, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$axios.post("http://localhost:8088/buDetails/delete_competitor",
            this.qs.stringify({competitorId:row.competitorId})).then(v=>{
            this.selectCompetitor(this.business.businesId);
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          }).catch();
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      //查询所有的竞争对手
      selectCompetitor(businesId){
        this.$axios.get("http://localhost:8088/buDetails/select_competitor",
          {params:{businesId:businesId}}).then(v=>{
          this.competitorList=v.data;
        }).catch();
      },
      //显示方案表单
      clickProgramme(){
        if(this.$refs.programmeRules !=undefined){
          this.$refs.programmeRules.resetFields();
        }
        this.clearProgramme();//清空表单
        this.programmeObject.businessInfoByBusinesId.businesId=this.business.businesId;
        this.programmeObject.businessInfoByBusinesId.businessName=this.business.businessName;
        this.programmeObject.customerByCustomId=this.business.customerByCustomId;
        this.programmeObject.programmeEmp = JSON.parse(sessionStorage.getItem("user"));
        this.isProgramme=true;
      },
      //清空方案表单
      clearProgramme(){
        this.programmeObject={//方案对象
          programmeId:0,//方案id
          programmeTitle:'',//方案主题
          businessInfoByBusinesId:{//商机对象
            businesId:0,//商机id
            businessName:''//商机名称
          },
          customerByCustomId:{//客户对象
            customId:0,//客户id
            cusName:'',//客户名称
          },
          programmeEmp:{//方案制定人
            employeesId:'',
            empName:''
          },
          programmeContent:'',//方案内容
          customerFeedback:''//客户反馈
        }
      },
      //修改方案
      updateprogramme(val){
        this.programmeObject.programmeId=val.programmeId;
        this.programmeObject.programmeTitle=val.programmeTitle;
        this.programmeObject.businessInfoByBusinesId.businesId=val.businessInfoByBusinesId.businesId;
        this.programmeObject.businessInfoByBusinesId.businessName=val.businessInfoByBusinesId.businessName;
        this.programmeObject.customerByCustomId.customId=val.customerByCustomId.customId;
        this.programmeObject.customerByCustomId.cusName=val.customerByCustomId.cusName;
        this.programmeObject.programmeContent=val.programmeContent;
        this.programmeObject.customerFeedback=val.customerFeedback;
        this.programmeObject.programmeEmp.employeesId = val.programmeEmp.employeesId;
        this.programmeObject.programmeEmp.empName = val.programmeEmp.empName;
        this.isProgramme=true;
      },
      //新增或修改方案
      saveProgramme(){
        this.$refs.programmeRules.validate((valid) => {
          if (valid) {
            var id=this.programmeObject.businessInfoByBusinesId.businesId;
            var programme=JSON.stringify({programme:this.programmeObject});
            this.$axios.post("http://localhost:8088/buDetails/save_programme",
              this.qs.stringify({programme:programme})).then(v=>{
              if(v.data==1){
                this.queryBusiness(id);
              }

              this.isProgramme=false;
              //更新表格
              this.selectProgramme(id);
              if(this.programmeObject.programmeId>0){
                this.$message.success("修改成功！");
              }else{
                this.$message({
                  type: 'success',
                  message: '添加成功!'
                });
              }
              this.clearProgramme();
              //清空表单
              this.$refs.programmeRules.resetFields();
            }).catch();
          } else {
            return false;
          }
        });

      },
      //查询商机下的解决方案
      selectProgramme(businesId){
        this.$axios.get("http://localhost:8088/buDetails/select_programme",
          {params:{businesId:businesId}}).then(v=>{
          this.programmeList=v.data;
        }).catch();
      },
      //查询商机绑定的联系人
      selectClinkman(businesId){
        this.$axios.get("http://localhost:8088/buDetails/select_culinkman",
          {params:{businesId:businesId}}).then(v=>{
          this.contactsList=v.data;
        }).catch();
      },
      //关联联系人 先查询客户的所有联系人
      selectCustomerCulinkman(relation){
        this.$axios.get("http://localhost:8088/buDetails/culinkmanList"
          ,{params:{customerId:this.business.customerByCustomId.customId,cupName:relation}}).then(v=>{
          this.culinkManList=v.data;
        }).catch();
      },
      //客户联系人模糊查询
      searchCulinkMan(){
        this.selectCustomerCulinkman(this.relation);
      },
      //选中联系人 储存联系人的id
      retainId(cupId){
        this.cupId1=cupId;
      },
      //确认关联联系人
      contactOk(){
        var cutact=JSON.stringify({businesId:this.business.businesId,cupId:this.cupId1});
        this.$axios.post("http://localhost:8088/buDetails/updateCulinkman",
          this.qs.stringify({cutact:cutact})).then(()=>{
          this.selectClinkman(this.business.businesId);
          this.isContact=false;
        }).catch();
      },
      //查询商机下的产品
      selectDetails(businesId){
        this.$axios.get("http://localhost:8088/buInfo/businessDatails",
          {params:{businesId:businesId}})
          .then(v=>{
            //赋值给产品数组
            this.detailsList =v.data;

          }).catch()
      },
      //产品类型加载
      initCategory(){
        //加载产品分类
        this.$axios.get("http://localhost:8088/buInfo/category")
          .then(v=>{
            this.data2=v.data;
          }).catch();
        this.pageSize2=this.productSizes[0];
        this.initProduct(this.currentPage2,this.pageSize2,this.searchPro,this.pcId,this.pbId);
      },
      //产品列表
      initProduct(currentPage2,pageSize2,searchPro,pcId,pbId){
        this.$axios.get("http://localhost:8088/buInfo/newproduct_info",
          {
            params:{
              productName:searchPro,
              pcId:pcId,
              pbId:pbId
            }
          })
          .then(v=>{
            this.goodList=v.data;
          }).catch()
      },
      //改变产品列表页数
      changeProSize(val){
        this.initProduct(this.searchPro,this.pcId,this.pbId);
      },
      //改变产品分页的每页页数
      handleSizeChange2(val){
        this.initProduct(this.searchPro,this.pcId,this.pbId);
      },
      //类型加品牌查询 和模糊查询
      handleChange(item) {
        if(this.category !='' ){
          this.pcId=item[0];
          this.pbId=item[1];
        }else{
          this.pcId=0;
          this.pbId=0;
        }
        this.initProduct(this.searchPro,this.pcId,this.pbId);

      },
      searchProduct(){
        this.initProduct(this.searchPro,this.pcId,this.pbId);
      },
      //复选框选中的
      handleSelectionChange(val) {
        this.multipleSelection = val;               //  this.multipleSelection 选中的值

      },
      //查看客户的历史产品
      lookHistoryProducts(searchHistoryProducts){
        if(this.num == 0){
          this.$message({
            type: 'info',
            message: '该客户没有历史产品！'
          });
        }else{
          this.historyProducts = true;//打开弹框
        }

      },
      handleSizeChange: function(val){
        this.pagesize = val;
      },
      handleCurrentChange:function(val){
        this.currentPage = val;
      },
      //查询出的历史产品数据
      historyProductsData(customId,searchHistoryProducts){
        this.$axios.get("http://localhost:8088/buDetails/select_histroy_products",
          {params:{
            customId:customId,
            prName:searchHistoryProducts
          }
        }).then(v=>{
          this.historyProductsList = [];
          this.historyProductsList = v.data;
          this.num = this.historyProductsList.length;
        }).catch();
      },
      //模糊查询
      changeSearchProducts(){
        this.historyProductsData(this.searchHistoryProducts);
      },
      //采用历史折扣
      historyDiscount(row){
        this.$confirm('此操作将采用'+row.prName+row.prModel+'的折扣'+row.discount+', 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          if(this.detailsList.length==0){
            this.$message({
              type: 'error',
              message: '采用失败！'
            });
          }else{
            var flag=false;
            this.productList.forEach((item,i)=>{
              if(item.prsId == row.prsId){
                this.productList[i].detDiscount = row.discount;
                this.smallPrice(i, this.productList[i]);//重新计算价格
                flag=true;
              }
            })
            if(flag==false){
              this.$message({
                type: 'error',
                message: '相同产品才能采用历史折扣！'
              });
            }else{
              this.historyProducts = false;
            }
          }

        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      //弹框编辑产品按钮
      saveDetails(){
        if(this.flag == true){
          var details=JSON.stringify({businesId:this.business.businesId,productList:this.productList});
          this.$axios.post("http://localhost:8088/buDetailsTwo/addBusinessDetails",
            this.qs.stringify({details:details})).then(()=>{
            this.selectDetails(this.business.businesId);
            this.isEditGood=false;//关闭弹框
          }).catch();
        }
      },
      //确认选择产品
      determineProducts(){
        var flag = false;
        //数组临时添加 数量:detNum 小计:detTotal 折扣:detDiscount
        this.$refs.multipleSelection.selection.forEach((item,i)=>{
          flag = false;
          //判断已有的产品是否存在 当detailsList长度不为0的时候 可进行比较
          //detailsList长度为0的时候 可直接添加产品
          if(this.productList.length !=0){
            this.productList.forEach(list=>{
              //产品已存在，则提示产品已存在，只能修改产品数量
              if(item.psId == list.prsId){
                console.log("已选产品:"+item.prsId+"已存在产品:"+list.psId);
                this.$confirm('此产品已经存在，如需添加请直接修改数量!', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning',
                  center: true
                }).then(() => {
                }).catch(() => {
                });
                flag=true;
              }

            })
          }
          if(flag==false){
            //不存在产品,则可以添加
            this.addList(item,i);
          }
        })
        this.multipleSelection=[];
        this.$refs.multipleSelection.clearSelection();
        //关闭弹框
        this.isAddGood=false;
      },
      //添加的产品的方法
      addList(item,i){
        this.$set(item,'prsId',item.psId);
        this.$set(item,'detPrice',item.psPrice);
        this.$set(item,'detDiscount','0.00');
        this.$set(item,'detDiscountedPrice',item.psPrice);
        this.$set(item,'detNum',1);
        this.$set(item,'detTotal',item.psPrice);
        this.$set(item,'detFactoryrice',item.psFactoryPrice);
        this.productList.splice(i,0,item);
      },
      //验证折扣是否正确
      checkMoney(index,row){
        console.log("折扣："+row.detDiscount);
        this.flag=true;
        var a=/^0+\.\d{2}$/;
        if(row.detDiscount==''){
          this.productList[index].detDiscount='0.00';//重新赋值
          this.smallPrice(index, this.productList[index]);
        }else{
          if(a.test(row.detDiscount)){
            this.smallPrice(index,row);
          }else{
            this.$message.error("折扣格式错误!");
            this.flag=false;
          }
        }
      },
      //产品计算小计
      smallPrice(index,row){
        //小计不能低于成本价
        let price=0;//小计
        let jprice=0;//进价
        let detDiscountedPrice=0;
        if(row.detDiscount=='0.00'){//不享受折扣
          //售价*数量
          price=parseFloat(row.detPrice).toFixed(2)*row.detNum;
          detDiscountedPrice=parseFloat(row.detPrice).toFixed(2);
          this.flag=true;
        }else{//享受折扣
          //售价*折扣*数量
          price=parseFloat(row.detPrice).toFixed(2)*parseFloat(row.detDiscount).toFixed(2)*row.detNum;
          jprice=parseFloat(row.detFactoryrice).toFixed(2)*row.detNum;
          detDiscountedPrice=parseFloat(row.detPrice).toFixed(2)*parseFloat(row.detDiscount).toFixed(2);
          console.log("出厂价:"+row.detFactoryrice);
          console.log("售价:"+price);
          console.log("进价:"+jprice);
          if(price<jprice){
            this.$message.error("折扣不能太低！");
            this.flag = false;
          }else{
            this.flag = true;
          }
        }
        if(this.flag==true){
          this.productList[index].detDiscountedPrice=detDiscountedPrice;//
          this.productList[index].detTotal=price;//重新给小计赋值
        }

      },

      //复选框选中的值
      handleChange1(val){
        this.pList=val;
      },

      //删除产品
      deleteGood(){
        if(this.pList.length==0){
          this.$message.error("请先选中!");
        }else{
          this.$confirm('此操作将永久删除该产品, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.pList.forEach((item,i)=>{
              this.productList.forEach((val,k)=>{
                if(item.prsId == val.prsId){
                  this.productList.splice(k,1);
                }
              })

            })

            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除'
            });
          });
        }

      },
      //报价单号
      code(){
        this.$axios.get("http://localhost:8088/buDetailsTwo/offerNumber").then(v=>{
          this.offerObject.offerNumber=v.data;
        }).catch();
      },
      //添加报价单按钮
      offerButton(){
        if(this.$refs.offerFrom !=undefined){
          this.$refs.offerFrom.resetFields();
        }
        this.clearOffer();
        this.code();
        this.offerObject.businessInfoByBusinesId.businesId=this.business.businesId;
        this.offerObject.businessInfoByBusinesId.businessName=this.business.businessName;
        this.offerObject.customerByCustomId=this.business.customerByCustomId;
        this.offerObject.offerEmp=JSON.parse(sessionStorage.getItem('user'));
        this.isUpdate=true;
      },
      //报价单确定按钮
      saveOffer(){
        this.$refs.offerFrom.validate((valid) => {
          if (valid) {
            this.offerObject.productOffer=this.productOffer;
            this.offerObject.profit=this.profit;
            var offer=JSON.stringify({offer:this.offerObject,offerDetails:this.detailsList});
            this.$axios.post("http://localhost:8088/buDetailsTwo/saveOffer",this.qs.stringify({offerData:offer})).then(v=>{
              if(v.data==1){
                this.queryBusiness(this.business.businesId);
              }
              this.queryOffer(this.business.businesId);
              this.$refs.offerFrom.resetFields();
              this.clearOffer();
              this.isUpdate=false;
            }).catch();
          } else {
            return false;
          }
        });

      },
      //清空offer表单
      clearOffer(){
        this.offerObject= {
          offerId2: 0,//报价id
          offerTitle: '',//报价主题
          offerNumber: '',//报价单号
          productOffer: 0,//产品报价
          profit: '',//预估毛利
          paymentInstructions: '',//付款说明
          transportInstructions: '',//运输说明
          offerRemarks: '',//备注
          offerEmp: {//员工对象
            employeesId: 0,
            empName: ''
          },
          approvaler: '',//审批人
          customerByCustomId: {//客户对象
            customId: 0,
            cusName: '',
          },
          businessInfoByBusinesId: {//商机对象
            businesId: 0,
            businessName: ''
          }
        }
      },
      //查询商机下的报价单
      queryOffer(businesId){
        this.$axios.get("http://localhost:8088/buDetailsTwo/business_offer",
          {params:{businesId:businesId}}).then(v=>{
          this.offerList=v.data;
        }).catch();
      },
      //查看报价明细
      lookDetails(row){
        this.offer1(row.offerId2);
        this.offer2(row.offerId2);
        this.approvalRecord(row.offerId2);
        this.isOfferDetails=true;
      },
      //审批记录
      approvalRecord(offerId){
        this.$axios.get("http://localhost:8088/che/deliver-id",
          {params:{
              apprTitle:'报价审批',
              apprIds:offerId
            }}).then(v=>{
          this.activities1 = v.data;
        }).catch();
      },
      offer1(offerId){
        this.$axios.get("http://localhost:8088/buDetailsTwo/offerOne",
          {params:{offerId:offerId}}).then(v=>{
          this.offerOne=v.data;
          this.offerOne.productOffer = number_format(v.data.productOffer, 2, ".", ",");
          this.offerOne.profit = number_format(v.data.profit, 2, ".", ",");
        }).catch();
      },
      offer2(offerId){
        this.$axios.get("http://localhost:8088/buDetailsTwo/offerTwo",
          {params:{offerId:offerId}}).then(v=>{
          this.offerTwo=v.data;
        }).catch();
      },
      //打印报价单据
      printOffer(){
        if(this.offerOne.offerStatus != 4){
          this.$message({
            type: 'error',
            message: '报价单不支持打印!'
          });
        }else{//打印
          this.$router.push({
            path:"/quotation",
            query:{
              offerId:this.offerOne.offerId2
            }
          })
        }
      }
    },
    watch:{
      $route(){//跳转到该页面后需要进行的操作
        if(this.$route.query.businesId> 0 &&this.$route.query.businesId!=''){
          this.keEdit = this.$route.query.status;
          this.queryBusiness(this.$route.query.businesId);//商机顶部信息
          this.queryFollowUp(this.$route.query.businesId);//加载跟进记录
          this.queryDemand(this.$route.query.businesId);//加载详细需求
          this.selectCompetitor(this.$route.query.businesId);//加载所有竞争对手
          this.selectProgramme(this.$route.query.businesId);//加载所有解决方案
          this.selectClinkman(this.$route.query.businesId);//加载商机下客户联系人
          this.selectDetails(this.$route.query.businesId);//加载商机下的产品详情
          this.initCategory();//加载产品类型
          this.queryOffer(this.$route.query.businesId);//加载商机下的报价单
          this.selectApproval();
          this.comProPageNum = this.pageList[0];
          this.initComPro(this.comProPageSize, this.comProPageNum,this.comProductsName,this.comPower);//竞品
          this.selectAllCompetitor();  //所有竞争公司

        }
      }
    },
    computed:{
      //计算产品详情产品的总金额
      ProductTotal(){
        var total=0;//总金额
        var pro=0;//利润
        var jprice=0;//进价总
        this.detailsList.forEach(item=>{
          total=total+item.detTotal;
          jprice=jprice+item.detNum*parseFloat(item.detFactoryrice).toFixed(2);
          console.log("进价:"+item.detFactoryrice);
        })
        console.log("总价："+total+"进价总:"+"预估毛利:"+pro);
        pro=total-jprice;
        this.offerObject.productOffer=number_format(total, 2, ".", ",");
        this.offerObject.profit=number_format(pro, 2, ".", ",");
        //保存原来的金额格式
        this.productOffer = total;
        this.profit = pro;
        return total;
      },
      count(){
        return  this.pList.length;
      },
      proTotal(){
        var total1=0;
        console.log("数组长度:"+ this.productList.length);
        this.productList.forEach((item,i)=>{
          console.log("小计:"+item.detTotal+"次数:"+i);
          total1=total1+item.detTotal;
        })
        return total1;
      }

    },
    filters: {
      formatDate: function (time) {
        if (time != null && time != "") {
          var date = new Date(time);
          return formatTimeToStr(date, "yyyy-MM-dd");
        } else {
          return "";
        }
      },
      formatMoney(val) {
        val = val.toString().replace(/\$|\,/g, "");
        if (isNaN(val)) {
          val = "0";
        }
        let sign = (val == (val = Math.abs(val)));
        val = Math.floor(val * 100 + 0.50000000001);
        let cents = val % 100;
        val = Math.floor(val / 100).toString();
        if (cents < 10) {
          cents = "0" + cents;
        }
        for (let i = 0; i < Math.floor((val.length - (1 + i)) / 3); i++) {
          val = val.substring(0, val.length - (4 * i + 3)) + "," + val.substring(val.length - (4 * i + 3));
        }
        return (((sign) ? "" : "-") + val + "." + cents);
      }
    }
  }
  function number_format(number, decimals, dec_point, thousands_sep) {
    /*
        * 参数说明：
        * number：要格式化的数字
        * decimals：保留几位小数
        * dec_point：小数点符号
        * thousands_sep：千分位符号
        * */
    number = (number + '').replace(/[^0-9+-Ee.]/g, '');
    var n = !isFinite(+number) ? 0 : +number,
      prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
      sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
      dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
      s = '',
      toFixedFix = function (n, prec) {
        var k = Math.pow(10, prec);
        return '' + Math.floor(n * k) / k;
      };
    s = (prec ? toFixedFix(n, prec) : '' + Math.floor(n)).split('.');
    var re = /(-?\d+)(\d{3})/;
    console.log(s)
    while (re.test(s[0])) {
      s[0] = s[0].replace(re, "$1" + sep + "$2");
    }
    if ((s[1] || '').length < prec) {
      s[1] = s[1] || '';
      s[1] += new Array(prec - s[1].length + 1).join('0');
    }
    return s.join(dec);
  }
</script>

<style scoped>
  .details{
    width:98%;
    height: 100%;
    background: white;
    border:1px solid #ccc;
    border-radius: 5px;
    margin-left:10px;
    box-shadow:#ccc 0px 0px 10px;

  }
  .detailsTop{
    border-bottom: 1px solid rgb(204, 204, 204);
    width: 98%;
    margin-left: 10px;
    margin-top: 15px;
    height: 100px;
  }
  .businessName{
    margin-top: -32px;
    margin-left: 41px;
    font-size:14px;
    color:#777;
  }
  .businessButton{
    float: right;
    margin-top: -25px;
    margin-right: 12px;
  }
  .step{
    height: 74px;
    width: 97%;
    border: 0px solid red;
    margin-top: 30px;
  }

  <!--面板-->
      .el-tab-pane{
        text-align: center;
      }

  .followOne{
    position: relative;
    top: -12px;
  }
  .followTwo{
    margin-left: 43px;
  }
  .followThree{
    margin-top: 15px;
    margin-left: 43px;
  }
  .quickAdd{
    margin-top:10px;

  }
  .jin{
    margin-top: -10px;
  }
  .block{
    margin-left: 24px;
  }

  /**管理快捷跟进模板*/
  .Administration{
    width:38%;
    border-radius: 2px;
    background: white;
    position: fixed;
    z-index: 5;
    top:15%;
    left:30%;
  }
  .moban{
    border-top:1px solid #B3C0D1;
    min-height:110px;
    height:310px;
    overflow: hidden;
    border-bottom:1px solid #B3C0D1;
  }
  .moban .el-row{
    border-bottom: 1px dashed #d3d3d6;
  }

  .classOne{
    line-height: 30px;
    margin-left: 10px;
  }




  /**添加产品*/
  .dept-dialog{
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.5);
    position:fixed;
    top:0px;
    left:0px;
    z-index:4;
  }
  .editGood{
    border-radius: 2px;
    background: white;
    position: fixed;
    width:56%;
    left:22%;
    top:16%;
    margin:0 auto;
    color:#777;
  }
  .editFont{
    font-size: 13px;
  }
  .editTable{
    margin: 0 auto;
    width:95%;
  }
  .editGood .button{
    margin-top:10px;
    float: right;
    margin-right: 20px;
    height: 50px;
  }



  #setting{
    cursor: pointer;
  }
  .el-tag{
    margin-left:10px;
    margin-top:5px;
  }
  <!--展开列-->
      .demo-table-expand {
        font-size: 0;
      }
  .demo-table-expand label {
    width: 90px;
    color: #99a9bf;
  }
  .demo-table-expand .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
    width: 50%;
  }

  .demo-table-expand1 {
    font-size: 0;
  }
  .demo-table-expand1 label {
    width: 90px;
    color: #99a9bf;
  }
  .demo-table-expand1 .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
    width: 50%;
  }

  >>> .el-dialog__body{
    padding: 0px 20px;
  }
  .el-input-number--mini {
    width: 87px;
    line-height: 26px;
  }

  >>>.bjDetails .el-input__inner{
    border-radius: 0px;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
  }
  .print .el-button--text{
    color:black;
  }
  .timeline >>> .el-timeline-item__timestamp.is-bottom {
    margin-top: -4px;
  }
  .timeline >>> .el-timeline-item {
    position: relative;
    padding-bottom: 0px;
  }

</style>
